﻿@using Abp.Authorization.Users
@using DevM.Web.Startup
@model DevM.Web.Models.ReleaseRecord.ReleaseRecordListViewModel
@{
    ViewBag.CurrentPageName = PageNames.ReleaseRecords; // The menu item will be active for this page.
}
@section scripts
{
    <script src="~/js/boostrap-pagination.js"></script>
    <script src="~/view-resources/Views/ReleaseRecords/Index.js" asp-append-version="true"></script>
}
<style>
    .dropdown {
        list-style-type: none;
    }
    /*去点栅格自带的 margin*/
    .card .body .col-xs-12, .card .body .col-sm-12, .card .body .col-md-12, .card .body .col-lg-12 {
        margin-bottom: unset;
    }

    .card .body .col-xs-4, .card .body .col-sm-4, .card .body .col-md-4, .card .body .col-lg-4 {
        margin-bottom: unset;
    }
    .btn-showlog
    {
        margin-right:10px;
    }
</style>
<ol class="breadcrumb">
    <li><a href="@Url.Action("Index","Projects")">@L("Projects")</a></li>
    <li class="active">@L("ReleaseRecords")</li>
</ol>
<div class="row clearfix">
    <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
        <div class="card">
            <div class="header">
                <h2>
                    @L("ReleaseRecords") : @Model.Project.Name
                </h2>
                <ul class="header-dropdown m-r--5">
                    <li class="dropdown">
                        <a href="javascript:void(0);" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
                            <i class="material-icons">more_vert</i>
                        </a>
                        <ul class="dropdown-menu pull-right">
                            <li><a id="RefreshButton" href="javascript:void(0);" class="waves-effect waves-block"><i class="material-icons">refresh</i>@L("Refresh")</a></li>
                        </ul>
                    </li>
                </ul>
            </div>
            <div class="body table-responsive">
                <div>
                    @foreach (var item in Model.ReleaseRecords.Items)
                    {
                        <div class="panel panel-default">
                            <div class="panel-heading">
                                <i class="glyphicon glyphicon-tags" style="@(item.CurrentEnvironment==null?"":"color:"+item.CurrentEnvironment.Color)">&nbsp;</i>
                                <span>
                                    @(item.CurrentEnvironment == null ? L("Processing") : $"{Model.Environments.IndexOf(Model.Environments.Where(e => e.Id == item.CurrentEnvironmentId).FirstOrDefault()) + 1}/{Model.Environments.Count}--{ L("PublishAt")} ：{item.LastModificationTime?.ToString("yyyy-MM-dd HH:mm:ss")}")
                                </span>
                                <ul class="header-dropdown m-r--5 pull-right">
                                    <li class="dropdown">
                                        <a href="javascript:void(0);" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
                                            <i class="material-icons">menu</i>
                                        </a>
                                        <ul class="dropdown-menu pull-right">
                                            <li>
                                                <a href="@Url.Action("Datas","DataMigration")?ReleaseRecordId=@item.Id" class="waves-effect waves-block btn-migration-data">
                                                    <i class="glyphicon glyphicon-list-alt"></i>
                                                    @L("DataMigration")
                                                </a>
                                            </li>
                                            <li>
                                                <a href="@Url.Action("Databases","DataMigration")?ReleaseRecordId=@item.Id" class="waves-effect waves-block btn-migration-datatable">
                                                    <i class="glyphicon glyphicon-th-list"></i>
                                                    @L("DataTableMigration")
                                                </a>
                                            </li>
                                            <li>
                                                <a href="@Url.Action("Configs","DataMigration")?ReleaseRecordId=@item.Id" class="waves-effect waves-block btn-migration-config">
                                                    <i class="glyphicon glyphicon-cog"></i>
                                                    @L("ConfigMigration")
                                                </a>
                                            </li>
                                        </ul>
                                    </li>
                                </ul>

                            </div>
                            <div class="panel-body">
                                <div class="row clearfix">
                                    <div class="col-lg-2 col-md-3 col-sm-12 col-xs-12">
                                        <p>@L("ConfigsCount")：@item.ConfigsCount</p>
                                    </div>
                                    <div class="col-lg-2 col-md-3 col-sm-12 col-xs-12">
                                        <p>@L("DatasCount")：@item.DatasCount</p>
                                    </div>
                                    <div class="col-lg-2 col-md-3 col-sm-12 col-xs-12">
                                        <p>@L("DatabasesCount")：@item.DatabasesCount</p>
                                    </div>
                                </div>



                                <ul class="list-group">
                                    @foreach (var env in Model.Environments)
                                    {
                                        <li class="list-group-item">
                                            <div class="row clearfix">

                                                <div class="col-lg-4 col-md-4 col-sm-12 col-xs-12">
                                                    <i class="glyphicon glyphicon-tags" style="@("color:"+env.Color)">&nbsp;</i>
                                                    <span>@env.Name,@env.Host</span>
                                                </div>
                                                <div class="col-lg-4 col-md-4 col-sm-12 col-xs-12">
                                                    @if (item.CurrentEnvironment != null && item.CurrentEnvironment.Id >= env.Id)
                                                    {
                                                        <div class="row  clearfix badge-feedbacktotal" data-releaserecord-environmentid="@env.Id" data-releaserecord-id="@item.Id" style="margin-left:1px">
                                                            <span col-lg-3 col-md-3 col-sm-3 col-xs-3>
                                                                <span class="badge badge-feedbacktotal-pending" style="background:#ff0000" title="@L("Pending")">0</span>
                                                            </span>
                                                            <span col-lg-3 col-md-3 col-sm-3 col-xs-3>
                                                                <span class="badge badge-feedbacktotal-claimed" style="background:#ec971f" title="@L("Claimed")">0</span>
                                                            </span>
                                                            <span col-lg-3 col-md-3 col-sm-3 col-xs-3>
                                                                <span class="badge badge-feedbacktotal-processing" style="background:#337ab7" title="@L("Processing")">0</span>
                                                            </span>
                                                            <span col-lg-3 col-md-3 col-sm-3 col-xs-3>
                                                                <span class="badge badge-feedbacktotal-processed" style="background:#449d44" title="@L("Processed")">0</span>
                                                            </span>
                                                        </div>
                                                    }


                                                </div>
                                                <div class="col-lg-4 col-md-4 col-sm-12 col-xs-12">
                                                    @if (Model.Environments.IndexOf(Model.Environments.Where(e => e.Id == item.CurrentEnvironmentId).FirstOrDefault()) + 1 == Model.Environments.IndexOf(env))
                                                    {
                                                        <button type="button" class="btn btn-xs btn-primary btn-release pull-right" data-toggle="modal" data-target="#ReleaseModal" data-releaserecord-environmentid="@env.Id" data-releaserecord-id="@item.Id">@L("Release")</button>
                                                    }

                                                    @if (item.CurrentEnvironment != null && item.CurrentEnvironment.Id >= env.Id)
                                                    {

                                                        <button type="button" data-feedback-releaserecordid="@item.Id" data-feedback-environmentid="@env.Id" class="btn btn-xs btn-warning pull-right btn-feedback">
                                                            @L("Feedback")
                                                        </button>

                                                        <button type="button" data-feedback-releaserecordid="@item.Id" data-feedback-environmentid="@env.Id" data-toggle="modal" data-target="#ReleaseLogShowModal"  class="btn btn-xs btn-success pull-right btn-showlog">
                                                            @L("Log")
                                                        </button>
                                                    }
                                                </div>
                                            </div>
                                        </li>
                                    }
                                </ul>
                            </div>
                        </div>
                    }
                </div>
                <nav aria-label="Page navigation">
                    <ul class="pagination" data-total="@Model.ReleaseRecords.TotalCount">
                        <li>
                            <a href="#" aria-label="Previous">
                                <span aria-hidden="true">&laquo;</span>
                            </a>
                        </li>
                        <li class="active"><a href="#">1</a></li>
                        <li><a href="#">2</a></li>
                        <li><a href="#">3</a></li>
                        <li><a href="#">4</a></li>
                        <li><a href="#">5</a></li>
                        <li>
                            <a href="#" aria-label="Next">
                                <span aria-hidden="true">&raquo;</span>
                            </a>
                        </li>
                    </ul>
                </nav>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="ReleaseModal" tabindex="-1" role="dialog" aria-labelledby="UserCreateModalLabel" data-backdrop="static">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title">
                    <span>@L("ReleaseInfo")</span>
                </h4>
            </div>
            <div class="modal-body">
                <form name="userCreateForm" role="form" novalidate class="form-validation">
                    <input type="hidden" name="ReleaseEnvironmentId" />
                    <input type="hidden" name="ReleaseRecordId" />
                    <ul class="nav nav-tabs tab-nav-right" role="tablist">
                        <li role="presentation" class="active"><a href="#create-releaselog-details" data-toggle="tab">@L("ReleaseLogDetails")</a></li>

                    </ul>
                    <div class="tab-content">
                        <div role="tabpanel" class="tab-pane animated fadeIn active" id="create-releaselog-details">

                            <div class="row clearfix">
                                <div class="col-sm-12">
                                    <div class="form-group form-float">
                                        <div class="form-line">
                                            <textarea type="text" name="Log" class="form-control" maxlength="2000"></textarea>
                                            <label class="form-label">@L("Log")</label>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="row clearfix">
                                <div class="col-sm-12">
                                    <div class="form-group form-float">
                                        <div class="form-line">
                                            <textarea type="text" name="Memo" class="form-control" maxlength="200"></textarea>
                                            <label class="form-label">@L("Memo")</label>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default waves-effect" data-dismiss="modal">@L("Cancel")</button>
                        <button type="submit" class="btn btn-primary waves-effect">@L("Save")</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="ReleaseLogShowModal" tabindex="-1" role="dialog" aria-labelledby="UserEditModalLabel" data-backdrop="static">
    <div class="modal-dialog" role="document">
        <div class="modal-content">

        </div>
    </div>
</div>
